<template>

    <div>
        <!--卡片-->
        <el-card class="box-card">
            <!--定义面包屑-->
            <el-breadcrumb separator=">">
                <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
                <el-breadcrumb-item>订单管理</el-breadcrumb-item>
                <el-breadcrumb-item>订单详情</el-breadcrumb-item>
            </el-breadcrumb>
            <el-divider></el-divider>
            <!--表单的搜索框
                 :model="双向绑定表单的数据"
            -->
            <el-form :inline="true" :model="orderFormData"  class="demo-form-inline">
                <el-form-item label="订单编号：">
                    <el-input v-model="orderFormData.orderNumber" placeholder="请输入订单编号"></el-input>
                </el-form-item>
                <el-form-item label="车牌号码：">
                    <el-input v-model="orderFormData.carNumber" placeholder="请输入车牌号码"></el-input>
                </el-form-item>
                <el-form-item label="客户姓名：">
                    <el-input v-model="orderFormData.username" placeholder="请输入客户姓名"></el-input>
                </el-form-item>
                <el-form-item label="客户手机号：">
                    <el-input v-model="orderFormData.phone" placeholder="请输入客户手机号"></el-input>
                </el-form-item>
                <el-form-item label="订单状态：">
                    <el-select v-model="orderFormData.orderStatus" clearable placeholder="请选择订单状态">
                        <el-option
                                v-for="item in selectData"
                                :key="item.levelId"
                                :label="item.levelName"
                                :value="item.levelId">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item  label="租车日期：">
                    <el-date-picker
                            v-model="dataValue"
                            type="datetimerange"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="还车日期：">
                    <el-date-picker
                            v-model="dataValue"
                            type="datetimerange"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期">
                    </el-date-picker>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="getAllOrder()">查询</el-button>
                </el-form-item>
            </el-form>

            <hr/>

            <!--数据表格-->
            <template>


                <!--分页-->


            </template>

        </el-card>
    </div>
    
</template>

<script>
    export default {
        name: "ShowOrderRecord",
        data(){
            return {
                orderFormData:{

                },

                //表格数据
                tableData:[],
                pageUtil:{
                    //每页显示的条数
                    pageSize: 5,
                    //当前的显示的页码
                    currentPage:1,
                },
                //总条数
                total:0,
            }
        },
    }
</script>

<style scoped>

</style>